<template>
    <div class="message">
        <div class="other">
            <Card v-for="(item, index) in msgList" :key="index" :title="item.title">
                <p v-html="item.content"></p>
                <div slot="extra">
                    <span v-text="DOMText.date+item.update_date"></span>
                </div>
            </Card>
            <p v-if="!msgList.length" align="center">
              没有消息!
            </p>
        </div>
    </div>
</template>

<script>
import { Get } from "../api";
export default {
  name: "Message",
  data() {
    return {
      DOMText: {
        title: "公告信息",
        author: "发布作者: ",
        date: "发布时间: "
      },
      msgList:[]
    };
  },
  props:{

  },
  async created() {
    let res = await Get.getMessage();
    this.msgList = res.data
  }
};
</script>

<style lang="less" scoped>
.message {
  &-title {
    border-bottom: 1px solid rgb(192, 192, 192);
    padding: 5px 0;
    font-size: 1rem;
  }
}
.fast {
  &-content {
    margin: 5px 0;
  }
}

.other {
    >*{
        margin-top: 10px;
    }
}
</style>